<template>  <!-- 手机更换绑定 -->
    <div class="mobile-bind">
        <div v-if="process">
           <div class="cPBoxItm-title">
               <div>更换手机号码</div>
               <span class="c-recovery" @click="shut"></span>
           </div>
           <div class="setPublic-tipBox">
               <span class="setPublic-tipCont"></span>
               <span class="setPublic-tipWarning" v-if="show">
                <span class="setPublic-tipIcon"></span>
                <span class="setPublic-tipErr">{{tip}}</span>
            </span>
           </div>
           <div class="setPublic-phone">
               <div class="setPublic-phoneInput">
                   <span class="setPublic-phoneInputTip">输入新手机号</span>
                   <div class="setPublic-phoneInputBox">
                       <input class="setPublic-inputCont" v-model="pNumber" maxlength="11"/>
                   </div>
               </div>
               <div class="setPublic-phoneInput">
                   <div class="setPublic-phoneInputBox">
                       <input class="setPublic-inputCont" v-model="pCode"  maxlength="6"/>
                   </div>
                   <div class="setPublic-inputSend" @click="obtainCode" :class="{dis:disable}">{{send}}</div>
               </div>
               <div class="setPublic-next">
                   <div class="setPublic-nextOne" @click="uploadPone">确定</div>
                   <div class="setPublic-nextClear" @click="shut">取消 </div>
               </div>
           </div>
       </div>
        <success v-if="!process" v-on:shut="shut"></success>
    </div>
</template>
<script>
    let filter = /^(((13[0-9]{1})|(15[0-9]{1})|(17[0-9]{1})|(18[0-9]{1}))+\d{8})$/;
    import success from './../public/psuccess.vue';
    export default{
        data(){
          return{
              pNumber:'',
              pCode:'',
              show:0,
              tip:'',
              send:"发送验证码",
              disable:0,
              oNumber:'',
              process:true
          }
        },
        methods:{
            shut:function () {
                this.$emit('close')
            },
            obtainCode:function () {
                if(this.pNumber!=''){
                    if(filter.test(this.pNumber)){
                        if(this.send=='发送验证码'){
                            this.send='发送中...';
                            this.disable=1;
                            $.ajax({
                                type:'post',
                                url : '/getValidCode',
                                data:{
                                    mobile:this.pNumber
                                },
                                success:(data)=>{
                                    data=JSON.parse(data);
                                    if(data.opResult==0){
                                        this.oNumber=this.pNumber;
                                        let time=()=>{
                                            this.send--;
                                            if(this.send==0){
                                                this.send='发送验证码';
                                                this.disable=0;
                                                clearInterval(seti1);
                                            }
                                        };
                                        this.tip='发送成功';
                                        this.show=1;
                                        this.send='';
                                        this.send=60;
                                        var seti1=setInterval(time,1000);
                                        setTimeout(()=>{this.show=0;},1500);

                                    }else if(data.opResult==1){
                                        this.tip='发送失败';
                                        this.send='发送验证码';
                                        this.disable=0;
                                        this.show=1;
                                        setTimeout(()=>{ this.show=0;},1500)
                                    }else if(data.opResult==2){
                                        this.send='发送验证码';
                                        this.disable=0;
                                        this.tip='新手机号码不能与旧手机号码一样';
                                        this.show=1;
                                        setTimeout(()=>{ this.show=0;},1500);
                                    }
                                },
                            });
                        }
                    }else {
                        this.tip='手机号码格式不正确';
                        this.show=1;
                        setTimeout(()=>{ this.show=0;},1500)
                    }
                }else{
                    this.tip='手机号码不能为空';
                    this.show=1;
                    setTimeout(()=>{ this.show=0;},1500)
                }
            },
            uploadPone:function () {
                if(this.pNumber!=''){
                    if(filter.test(this.pNumber)){
                        if(this.pCode!=''){
                            $.ajax({
                                type:'post',
                                url : '/switchPhone',
                                dataType:'json',
                                data:{
                                    mobile:this.oNumber,
                                    validCode:this.pCode
                                },
                                success:(data)=>{
                                    if(data.opResult==0){
                                        this.process=false;
                                    }else if(data.opResult==1){
                                        this.tip='绑定失败';
                                        this.show=1;
                                        setTimeout(()=>{ this.show=0;},1500);
                                    }else if(data.opResult==3){
                                        this.tip='验证码错误';
                                        this.show=1;
                                        setTimeout(()=>{ this.show=0;},1500);
                                    }
                                }
                            });
                        }else{
                            this.tip='验证码不能为空';
                            this.show=1;
                            setTimeout(()=>{ this.show=0;},1500)
                        }
                    }else {
                        this.tip='手机号码格式不正确';
                        this.show=1;
                        setTimeout(()=>{ this.show=0;},1500)
                    }
                }else {
                    this.tip='手机号码不能为空';
                    this.show=1;
                    setTimeout(()=>{ this.show=0;},1500)
                }

            }
        },
        components:{
            success:success
        }
    }
</script>
<style scoped>
    .dis{
        box-shadow:none !important;
        background-color:gray !important;
    }
</style>